The <base> tag specifies the base URL and/or target for all relative URLs in a document. The <base> tag must have either an "href" or a "target" attribute present, or both. There can only be one single <base> element in a document, and it must be inside the <head> element. If multiple <base> elements are used, only the first "href" and first "target" are obeyed — all others are ignored.
Attributes: this element's attributes include the global attributes. Specific attributes include:
href ; value: url;
the base URL to be used throughout the document for relative URLs. Absolute and relative URLs are allowed. When creating an anchor link, the "href attribute" can specify an absolute URL - like "http://example.com" - or a relative URL - such as "/", "/page-name", or "page-name". With relative URLs a slash ( / ) indicates the root URL of the current page. So, href="/page-name" would link to a page at currentdomain/page-name. Leaving off the slash links to a subpage of the current URL, so href="page-name" would link to current_url/page-name. Using the <base> element, you can change the base URL which the relative links on the page use. Instead of the current, actual URL of the current page, all relative links will be based on the URL specified in the href attribute of the <base> element.
target ; value: _blank, _parent, _self, _top;
specifies the default target for all hyperlinks and forms in the page. If you set target="_blank" in the <base> element, all links on the page (relative and absolute) will open in a new window, unless otherwise specified.
- notice that we have only specified a relative address for the image. Since we have specified a base URL in the head section, the browser will look for the image at "https://www.lwitters.com/tutorials/pics/1.jpg".
HTML object tag - notice that the link opens in a new window, even if it has no target="_blank" attribute. This is because the target attribute of the base element is set to "_blank".
P.S. The base URL in the head section has been disabled due to the presence of the href attribute in the "content section".
- notice that we have only specified a relative address for the image. Since we have specified a base URL in the head section, the browser will look for the image at "https://www.lwitters.com/tutorials/pics/1.jpg".